<template>
    <div class="weather">
        <img src="@/assets/home/qing.png">
        <span>晴</span>
        <div class="wendu">32/17°C</div>
    </div>
</template>

<script>
export default {
    name: "weather",
    props: {
        weatherData: {
            type: Object,
            default: () => ({})
        }
    }
}
</script>

<style lang="scss" scoped>
.weather{
    position: absolute;
    top: 62px;
    right: 91px;
    display: flex;
    align-items: center;
}
.img{
    width: 28px;
    height: 28px;
}
span{
    opacity: 0.85;
    mix-blend-mode: normal;
    text-align: center;
    color: rgba(255, 255, 255, 1);
    font-family: "Source Code Pro";
    font-weight: 600;
    font-size: 24px;
    line-height: 26px;
    margin: 0 12px 0 2px;
}
.wendu{
    color: rgba(255, 255, 255, 0.8);
    font-family: "Source Code Pro";
    font-weight: 400;
    font-size: 16px;
    line-height: 24px;
}
</style>